<template>
  <div>
    <!-- <div class="item_title">奖金未发放情况</div> -->
    <div>
      <el-table
        :data="tableData4"
        border
        style="width: 100%"
        id="out-table">
        <el-table-column
          prop="batch"
          label="批次">
        </el-table-column>
        <el-table-column
          prop="memberNum"
          label="会员编号">
        </el-table-column>
        <el-table-column
          prop="memberName"
          label="会员姓名">
        </el-table-column>
        <el-table-column
          prop="type"
          label="类别">
        </el-table-column>
        <el-table-column
          prop="remark"
          label="备注">
        </el-table-column>
        <el-table-column
          prop="reason"
          label="原因">
        </el-table-column>
        <el-table-column
          prop="month"
          label="月份">
        </el-table-column>
        <el-table-column
          prop="price"
          label="金额">
        </el-table-column>
      </el-table>
      <div class="page">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage3"
          :page-size="100"
          layout="prev, pager, next, jumper"
          :total="1000">
        </el-pagination>
      </div>
    </div>
    <div class="noSendPrice">
      未发放合计金额：-132.1
    </div>
  </div>
  
</template>

<script>
  import FileSaver from 'file-saver'
  import XLSX from 'xlsx'
  export default {
    data() {
      return {
        currentPage3:2,
        tableData4:[
          {
            batch:"S2018060017",
            memberNum:"00001118",
            memberName:"李丽",
            type:"计算金额",
            remark:"一般计算结果",
            reason:"",
            month:"2018.06",
            price:"12"
          },
          {
            batch:"S2018060042",
            memberNum:"00001118",
            memberName:"李丽",
            type:"双钻奖金",
            remark:"季度发双钻奖金",
            reason:"",
            month:"2018.06",
            price:"13342.00"
          }
        ]
      }
    },
    methods:{
      // 点击某一行
      rowClick(row,event,column){
        this.showPriceFrom = true
      },
      // 点击查看未发放奖金
      showSend(){
        this.showNoSend = true
      },
      // 分页
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
      },
      exportExcel () {
         /* generate workbook object from table */
         var wb = XLSX.utils.table_to_book(document.querySelector('#out-table'))
         /* get binary string as output */
         var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
         try {
             FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), 'sheetjs.xlsx')
         } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) }
         return wbout
     },
    }
  }
</script>
<style scoped>
.checkThing{
  text-align: center;
}

.noSendPrice{
  float: left;
  margin:5px 0;
}
</style>